<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0,user-scalable=no,minimal-ui">
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="../img/asset-favico.ico">
    <title>健康干预</title>
    <link rel="stylesheet" href="../plugins/elementui/index.css">
    <link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
    <!-- 引入组件库 -->
    <script src="../plugins/elementui/index.js"></script>
    <script src="../plugins/healthmobile.js"></script>
    <script src="../plugins/vue/vue.js"></script>
    <script src="../plugins/vue/axios-0.18.0.js"></script>
    <link rel="stylesheet" href="../css/page-health-intervention.css" />
    <script>
        var id = getUrlParam("id");
    </script>
</head>

<body data-spy="scroll" data-target="#myNavbar" data-offset="150">
<div class="app">
    <!-- 页面头部 -->
    <div class="top-header">
        <span class="f-left"><i class="icon-back" onclick="history.go(-1)"></i></span>
        <span class="center">传智健康</span>
        <span class="f-right"><i class="icon-more"></i></span>
    </div>
    <!-- 页面内容 -->
    <div class="contentBox">
        <div class="tab-wrapper">
            <ul class="tab-menu">
                <li class="active">膳食方案</li>
                <li>运动方案</li>
            </ul>
            <div class="tab-content">
                <div class="item">
                    <div class="intro-img">
                        <img src="../img/widget-program01.png" width="100%" />
                    </div>
                    <div class="table-title">
                        <span>推荐食物</span>
                        <span>含水量</span>
                        <span>摄入量</span>
                        <span>能量值(KJ)</span>
                    </div>
                    <table class="table" border="0" cellspacing="0" cellpadding="0">
                        <tbody>
                        <tr v-for="c in tableData">
                            <td><label :for="c.id">{{c.foodName}}</label></td>
                            <td><label :for="c.id">{{c.foodWater}}</label></td>
                            <td><label :for="c.id">{{c.foodEated }}</label></td>
                            <td><label :for="c.id">{{c.foodKJ}}</label></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="item">
                    <div class="table-title">
                        <span>运动名称</span>
                        <span>运动次数</span>
                        <span>运动周期</span>
                        <span>年龄上限</span>
                    </div>
                    <table class="table" border="0" cellspacing="0" cellpadding="0">
                        <tbody>
                        <tr v-for="c in tableData2">
                            <td><label :for="c.id">{{c.name}}</label></td>
                            <td><label :for="c.id">{{c.frequency}}</label></td>
                            <td><label :for="c.id">{{c.time}}</label></td>
                            <td><label :for="c.id">{{c.maxAge}}</label></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 页面 css js -->

<script src="../plugins/jquery/dist/jquery.min.js"></script>
<script src="../js/page-health-intervention.js"></script>
</body>
<script>
    var vue = new Vue({
        el: '.app',
        data: {
            id: id,
            level:3,
            imgUrl: null,//套餐对应的图片链接
            setmeal: {},
            tableData: [],
            tableData2: []

        },
        methods: {

        },
        mounted() {
            axios.post("/intervene/findMealByLevelId.do?id="+this.id+"&levelId="+this.level).then((response) => {
                this.tableData = response.data;
            });
            axios.post("/intervene/findSportByLevelId.do?levelId="+this.level).then((response) => {
                this.tableData2 = response.data;
            });
        }
    });
</script>